<!DOCTYPE html>
<html lang="en" style="height: 100%;">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="A simple slideshow component with individual slide layouts and effects" />
    <meta name="keywords" content="slideshow, images, layout, asymmetric, css, html, javascript, template" />
    <title></title>

    <link href="http://fonts.googleapis.com/css?family=Gochi+Hand" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="../../static/home/css/normalize.css" />
    <link rel="stylesheet" type="text/css" href="../../static/home/css/honorDemo.css" />
    <link rel="stylesheet" type="text/css" href="../../static/home/css/slideshow.css" />
    <link rel="stylesheet" type="text/css" href="../../static/home/css/slideshow_layouts.css" />
    <script>document.documentElement.className = 'js';</script>
    <style>
		html{
    /*隐藏滚动条，当IE下溢出，仍然可以滚动*/
    /* -ms-overflow-style:none; */
    /*火狐下隐藏滚动条*/
    /* overflow:-moz-scrollbars-none; */
}

/* 谷歌适用 */
::-webkit-scrollbar{
    /* display:none; */
}
*{
	overflow: hidden;
}
	</style>
</head>
<body>
    <h2 style="color: white;margin-top: 70px;text-shadow: 0px 2px 20px white;text-align: center;z-index: 999;position: relative;">荣誉展示</h2>
    <svg class="hidden">
			<defs>
				<symbol id="icon-arrow" viewBox="0 0 24 24">
					<title>arrow</title>
					<polygon points="6.3,12.8 20.9,12.8 20.9,11.2 6.3,11.2 10.2,7.2 9,6 3.1,12 9,18 10.2,16.8 "/>
				</symbol>
				<symbol id="icon-drop" viewBox="0 0 24 24">
					<title>drop</title>
					<path d="M12,21c-3.6,0-6.6-3-6.6-6.6C5.4,11,10.8,4,11.4,3.2C11.6,3.1,11.8,3,12,3s0.4,0.1,0.6,0.3c0.6,0.8,6.1,7.8,6.1,11.2C18.6,18.1,15.6,21,12,21zM12,4.8c-1.8,2.4-5.2,7.4-5.2,9.6c0,2.9,2.3,5.2,5.2,5.2s5.2-2.3,5.2-5.2C17.2,12.2,13.8,7.3,12,4.8z"/><path d="M12,18.2c-0.4,0-0.7-0.3-0.7-0.7s0.3-0.7,0.7-0.7c1.3,0,2.4-1.1,2.4-2.4c0-0.4,0.3-0.7,0.7-0.7c0.4,0,0.7,0.3,0.7,0.7C15.8,16.5,14.1,18.2,12,18.2z"/>
				</symbol>
				<symbol id="icon-prev" viewBox="0 0 100 50">
					<title>prev</title>
					<polygon points="5.4,25 18.7,38.2 22.6,34.2 16.2,27.8 94.6,27.8 94.6,22.2 16.2,22.2 22.6,15.8 18.7,11.8"/>
				</symbol>
				<symbol id="icon-next" viewBox="0 0 100 50">
					<title>next</title>
					<polygon points="81.3,11.8 77.4,15.8 83.8,22.2 5.4,22.2 5.4,27.8 83.8,27.8 77.4,34.2 81.3,38.2 94.6,25 "/>
				</symbol>
				<symbol id="icon-octicon" viewBox="0 0 24 24">
					<title>octicon</title>
					<path d="M12,2.2C6.4,2.2,1.9,6.7,1.9,12.2c0,4.4,2.9,8.2,6.9,9.6c0.5,0.1,0.7-0.2,0.7-0.5c0-0.2,0-0.9,0-1.7c-2.8,0.6-3.4-1.4-3.4-1.4C5.6,17.1,5,16.8,5,16.8C4.1,16.2,5,16.2,5,16.2c1,0.1,1.5,1,1.5,1c0.9,1.5,2.4,1.1,2.9,0.8c0.1-0.7,0.4-1.1,0.6-1.3c-2.2-0.3-4.6-1.1-4.6-5c0-1.1,0.4-2,1-2.7C6.5,8.8,6.2,7.7,6.7,6.4c0,0,0.8-0.3,2.8,1C10.3,7.2,11.1,7.1,12,7c0.9,0,1.7,0.1,2.5,0.3c1.9-1.3,2.8-1,2.8-1c0.5,1.4,0.2,2.4,0.1,2.7c0.6,0.7,1,1.6,1,2.7c0,3.9-2.4,4.7-4.6,5c0.4,0.3,0.7,0.9,0.7,1.9c0,1.3,0,2.4,0,2.8c0,0.3,0.2,0.6,0.7,0.5c4-1.3,6.9-5.1,6.9-9.6C22.1,6.7,17.6,2.2,12,2.2z" />
				</symbol>
				<clipPath id="polygon-clip-rhomboid" clipPathUnits="objectBoundingBox">
					<polygon points="0 1, 0.3 0, 1 0, 0.7 1" />
				</clipPath>
			</defs>
		</svg>
		<main>
			<div class="slideshow" tabindex="0" style="position:absolute;top:0px;">
				<div class="slide slide--layout-1" data-layout="layout1">
					<div class="slide-imgwrap">
						<div class="slide__img" style="overflow: hidden;">
              <div class="slide__img-inner" style="background-color: white;width: 100%;height: 100%;" >
				<h4>&nbsp;第十二届蓝桥杯</h4>
                <table style="width: 100%;text-align: center;line-height: 24px;">
					<thead>
						<th>奖项</th>
                  		<th>人数</th>
					</thead>
					<tbody>
						<tr>
							<td>省一</td>
							<td>8</td>
						</tr>
						<tr>
							<td>省二</td>
							<td>13</td>
						</tr>
						<tr>
							<td>省三</td>
							<td>10</td>
						</tr>
					</tbody>
                </table>
				<h4>&nbsp;第十一届蓝桥杯</h4>
                <table style="width: 100%;text-align: center;line-height: 24px;">
					<thead>
						<th>奖项</th>
                  		<th>人数</th>
					</thead>
					<tbody>
						<tr>
							<td>国二</td>
							<td>1</td>
						</tr>
						<tr>
							<td>省一</td>
							<td>3</td>
						</tr>
						<tr>
							<td>省二</td>
							<td>10</td>
						</tr>
						<tr>
							<td>省三</td>
							<td>5</td>
						</tr>
					</tbody>
                </table>
				<!-- <h3>&nbsp;第十届蓝桥杯</h3>
                <table style="width: 100%;text-align: center;line-height: 24px;">
					<thead>
						<th>竞赛类型</th>
                  		<th>奖项数量</th>
					</thead>
					<tbody>
						<tr>
							<td>国家二等奖</td>
							<td>2</td>
						</tr>
						<tr>
							<td>国家三等奖</td>
							<td>2</td>
						</tr>
						<tr>
							<td>省级一等奖</td>
							<td>2</td>
						</tr>
						<tr>
							<td>省级二等奖</td>
							<td>17</td>
						</tr>
						<tr>
							<td>省级三等奖</td>
							<td>23</td>
						</tr>
					</tbody>
                </table>
				<h3>&nbsp;第九届蓝桥杯</h3>
                <table style="width: 100%;text-align: center;line-height: 24px;">
					<thead>
						<th>竞赛类型</th>
                  		<th>奖项数量</th>
					</thead>
					<tbody>
						<tr>
							<td>国家一等奖</td>
							<td>1</td>
						</tr>
						<tr>
							<td>国家二等奖</td>
							<td>1</td>
						</tr>
						<tr>
							<td>国家三等奖</td>
							<td>2</td>
						</tr>
						<tr>
							<td>省级一等奖</td>
							<td>5</td>
						</tr>
						<tr>
							<td>省级二等奖</td>
							<td>5</td>
						</tr>
						<tr>
							<td>省级三等奖</td>
							<td>3</td>
						</tr>
					</tbody>
                </table> -->
              </div>
            </div>
						<div class="slide__img" style="overflow: hidden;">
							<div class="slide__img-inner" style="background-color: white;width: 100%;height: 100%;">
								<h4>&nbsp;创新创业</h4>
								<table style="width: 100%;height:65%;text-align: center;line-height: 24px;">
									<thead>
										<th>奖项</th>
										<th>人数</th>
									</thead>
									<tbody>
										<tr>
											<td>国家级</td>
											<td>4</td>
										</tr>
										<tr>
											<td>省级</td>
											<td>17</td>
										</tr>
										<tr>
											<td>校级</td>
											<td>7</td>
										</tr>
									</tbody>
								</table>
							</div>
						</div>
						<div class="slide__img">
							<div class="slide__img-inner"  style="overflow: hidden;background-color: white;">
								<h4 style="margin: 0.9em auto;">&nbsp;软著名称</h4>
								<table style="width: 100%;height:73%;text-align: center;line-height: 24px;font-size: 0.8em;">
									<tbody>
										<tr>
											<td>嗨抖短视频平台</td>
										</tr>
										<tr>
											<td>城市管理系统</td>
										</tr>
										<tr>
											<td>蓝牙点名系统</td>
										</tr>
										<tr>
											<td>商品报价服务平台系统</td>
										</tr>
									</tbody>
								</table>
							</div>
						</div>
					</div>
					<div class="slide__title">
						<h3 class="slide__title-main">荣获证书</h3>
						<p class="slide__title-sub">在各个竞赛中小组成员取得了良好的成绩</p>
					</div>
				</div><!-- /slide -->
				<div class="slide slide--layout-2" data-layout="layout2">
					<div class="slide-imgwrap">
						<div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/QQ截图20210428094307.png);"></div></div>
                    <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/QQ截图20210428094317.png);"></div></div>
                    <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/QQ截图20210428094327.png);"></div></div>
                    <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/QQ截图20210428094404.png);"></div></div>
                    <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/创青春5.jpg);"><h4 class="slide__img-caption">Today is someday</h4></div></div>
					</div>
					<div class="slide__title">
						<h3 class="slide__title-main">“创青春”河南省大学生创业大赛</h3>
						<p class="slide__title-sub">展示河南大学生创新能力与创业素质的综合赛事</p>
					</div>
				</div><!-- /slide -->
				<div class="slide slide--layout-3" data-layout="layout3">
					<div class="slide-imgwrap">
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/创青春1.jpg);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/创青春2.jpg);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/创青春3.jpg);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/one.jpg);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/创青春4.jpg);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/图1.jpg);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/创青春6.jpg);"></div></div>
					</div>
					<div class="slide__title">
						<h3 class="slide__title-main">“创青春”比赛现场</h3>
						<p class="slide__title-sub"></p>
					</div>
				</div><!-- /slide -->
				<div class="slide slide--layout-4" data-layout="layout4">
					<div class="slide-imgwrap">
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/QQ截图20210428094250.png);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/ACM集体合影.JPG);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/获奖组ACM合影.JPG);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/小组ACM集体合影.jpg);"></div></div>
					</div>
					<div class="slide__title">
						<h3 class="slide__title-main">ACM竞赛</h3>
						<p class="slide__title-sub">经过近40年的发展，ACM国际大学生程序设计竞赛已经发展成为全球最具影响力的大学生程序设计竞赛</p>
					</div>
				</div><!-- /slide -->
				<div class="slide slide--layout-5" data-layout="layout5">
					<div class="slide-imgwrap" style="padding: 0px;">
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/TIM图片20190905085613.jpg);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/TIM图片20190905085721.png);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/TIM图片20190905085733.png);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/TIM图片20190905085739.png);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/TIM图片20190905085807.png);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/TIM图片20190905085811.png);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/TIM图片20190905085814.png);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/TIM图片20190905085821.png);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/TIM图片20190905085825.png);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/TIM图片20190905085828.png);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/TIM图片20190905085831.png);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/TIM图片20190905085835.png);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/TIM图片20190905085838.png);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/TIM图片20190905085842.png);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/TIM图片20190905085849.png);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/TIM图片20190905085852.png);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/TIM图片20190905085856.png);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/TIM图片20190905085859.png);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/TIM图片20190905085903.png);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/TIM图片20190905085906.png);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/6EA8F649BDE98C4E2F604D5D42B49B8B.jpg);"></div></div>                       
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/82DA5473CF3A3B7725FC8DE225E760FF.jpg);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/6150B47AA1F4854E6083BF7AAE9B79D1.jpg);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/07059270745231418B9AEBC0914FE9C4.jpg);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/BD93B4E5BF75DBAD4A23B7B302C7C847.jpg);"></div></div>

					</div>
					<div class="slide__title">
						<h3 class="slide__title-main">蓝桥杯大赛</h3>
						<p class="slide__title-sub">是国内始终领跑的人才培养选拔模式并获得行业深度认可的IT类科技竞赛</p>
					</div>
				</div><!-- /slide -->
				<div class="slide slide--layout-6" data-layout="layout6">
					<div class="slide-imgwrap">
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/新时代新梦想2.jpg);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/新时代新梦想1.jpg);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/新时代新梦想2.jpg);"></div></div>
					</div>
					<div class="slide__title">
						<h3 class="slide__title-main">“新时代新梦想”创业大赛</h3>
						<p class="slide__title-sub">广大学生积极投身创新创业实践，敢闯会创，乘风破浪，立足专业</p>
					</div>
				</div><!-- /slide -->
				<div class="slide slide--layout-7" data-layout="layout7">
					<div class="slide-imgwrap">
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/CRM客户管理系统.jpg);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/交通信号控制系统.jpg);"></div></div>
                        <div class="slide__img"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/就业工作考核数据分析系统.jpg);"></div></div>
                        <div class="slide__img" style="top: 53%;"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/中学网站及管理系统.jpg);"></div></div>
                        <div class="slide__img" style="top: 53%;left: 35%;"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/物联网餐饮管理系统.jpg);"></div></div>
                        <div class="slide__img" style="top: 53%;left: 69%;"><div class="slide__img-inner" style="background-image: url(../../static/home/img/awards/农产品质量安全溯源系统.jpg);"></div></div>
					</div>
					<div class="slide__title">
						<h3 class="slide__title-main">软著</h3>
						<p class="slide__title-sub">对于软件作品所享有的发表权、开发者身份权、使用权、使用许可权和获得报酬权各项专有权利</p>
					</div>
				</div><!-- /slide -->
				<nav class="slideshow__nav slideshow__nav--arrows">
					<button id="prev-slide" class="btn btn--arrow" aria-label="Previous slide"><svg class="icon icon--prev"><use xlink:href="#icon-prev"></use></svg></button>
					<button id="next-slide" class="btn btn--arrow" aria-label="Next slide"><svg class="icon icon--next"><use xlink:href="#icon-next"></use></svg></button>
				</nav>
			</div><!-- /slideshow -->
			
		</main>
    <script src="../../static/home/js/imagesloaded.pkgd.min.js"></script>
    <script src="../../static/home/js/anime.min.js"></script>
    <script src="../../static/home/js/main.js"></script>
	<script type="text/javascript" src="../../static/home/js/jquery.min.js"></script>

    <script>
		(function() {
			interval = setInterval(()=>{
				slideshow.next();
			},5000)
			var slideshow = new MLSlideshow(document.querySelector('.slideshow'));
			document.querySelector('#next-slide').addEventListener('click', function() {
				clearInterval(interval)
				slideshow.next();
				setTimeout(()=>{
					interval = setInterval(()=>{
						slideshow.next();
					},5000)
				},5000)
			});

			document.querySelector('#prev-slide').addEventListener('click', function() {
				clearInterval(interval)
				slideshow.prev();
				setTimeout(()=>{
					interval = setInterval(()=>{
						slideshow.next();
					},5000)
				},5000)
			});
		})();
		
	</script>
	<script>
		//此处引用：鼠标滚轮mousewheel插件
	!function(a){"function"==typeof define&&define.amd?define(["jquery"],a):"object"==typeof exports?module.exports=a:a(jQuery)}(function(a){function b(b){var g=b||window.event,h=i.call(arguments,1),j=0,l=0,m=0,n=0,o=0,p=0;if(b=a.event.fix(g),b.type="mousewheel","detail"in g&&(m=-1*g.detail),"wheelDelta"in g&&(m=g.wheelDelta),"wheelDeltaY"in g&&(m=g.wheelDeltaY),"wheelDeltaX"in g&&(l=-1*g.wheelDeltaX),"axis"in g&&g.axis===g.HORIZONTAL_AXIS&&(l=-1*m,m=0),j=0===m?l:m,"deltaY"in g&&(m=-1*g.deltaY,j=m),"deltaX"in g&&(l=g.deltaX,0===m&&(j=-1*l)),0!==m||0!==l){if(1===g.deltaMode){var q=a.data(this,"mousewheel-line-height");j*=q,m*=q,l*=q}else if(2===g.deltaMode){var r=a.data(this,"mousewheel-page-height");j*=r,m*=r,l*=r}if(n=Math.max(Math.abs(m),Math.abs(l)),(!f||f>n)&&(f=n,d(g,n)&&(f/=40)),d(g,n)&&(j/=40,l/=40,m/=40),j=Math[j>=1?"floor":"ceil"](j/f),l=Math[l>=1?"floor":"ceil"](l/f),m=Math[m>=1?"floor":"ceil"](m/f),k.settings.normalizeOffset&&this.getBoundingClientRect){var s=this.getBoundingClientRect();o=b.clientX-s.left,p=b.clientY-s.top}return b.deltaX=l,b.deltaY=m,b.deltaFactor=f,b.offsetX=o,b.offsetY=p,b.deltaMode=0,h.unshift(b,j,l,m),e&&clearTimeout(e),e=setTimeout(c,200),(a.event.dispatch||a.event.handle).apply(this,h)}}function c(){f=null}function d(a,b){return k.settings.adjustOldDeltas&&"mousewheel"===a.type&&b%120===0}var e,f,g=["wheel","mousewheel","DOMMouseScroll","MozMousePixelScroll"],h="onwheel"in document||document.documentMode>=9?["wheel"]:["mousewheel","DomMouseScroll","MozMousePixelScroll"],i=Array.prototype.slice;if(a.event.fixHooks)for(var j=g.length;j;)a.event.fixHooks[g[--j]]=a.event.mouseHooks;var k=a.event.special.mousewheel={version:"3.1.12",setup:function(){if(this.addEventListener)for(var c=h.length;c;)this.addEventListener(h[--c],b,!1);else this.onmousewheel=b;a.data(this,"mousewheel-line-height",k.getLineHeight(this)),a.data(this,"mousewheel-page-height",k.getPageHeight(this))},teardown:function(){if(this.removeEventListener)for(var c=h.length;c;)this.removeEventListener(h[--c],b,!1);else this.onmousewheel=null;a.removeData(this,"mousewheel-line-height"),a.removeData(this,"mousewheel-page-height")},getLineHeight:function(b){var c=a(b),d=c["offsetParent"in a.fn?"offsetParent":"parent"]();return d.length||(d=a("body")),parseInt(d.css("fontSize"),10)||parseInt(c.css("fontSize"),10)||16},getPageHeight:function(b){return a(b).height()},settings:{adjustOldDeltas:!0,normalizeOffset:!0}};a.fn.extend({mousewheel:function(a){return a?this.bind("mousewheel",a):this.trigger("mousewheel")},unmousewheel:function(a){return this.unbind("mousewheel",a)}})});
		
		$(function(){
			var i=2;
			var $btn = parent.$('.section-btn li'),
				$wrap = parent.$('.section-wrap'),
				$arrow = parent.$('.arrow');
			
			/*当前页面赋值*/
			function up(){
				i = 3;
				console.log(i)
			}
			function down(){
				i = 1;
				console.log(i);
			}
			
			/*页面滑动*/
			function run(){
				console.log("run");
				$btn.eq(i).addClass('on').siblings().removeClass('on');	
				$wrap.attr("class","section-wrap").addClass(function() { return "put-section-"+i; }).find('.section').eq(i).find('.title').addClass('active');
			};
			
			/*右侧按钮点击*/
			$btn.each(function(index) {
				$(this).click(function(){
					i=index;
					run();
				})
			});
			
			/*翻页按钮点击*/
			// $arrow.one('click',go);
			// function go(){
			// 	console.log('点击向下翻页啊啊啊')
			// 	console.log(i)
			// 	// up();
			// 	// run();	
			// 	// setTimeout(function(){$arrow.one('click',go)},1000)
			// };
			
			$(document).bind('mousewheel DOMMouseScroll', function(event) {
					// IE/Chorme
					var wheel = event.originalEvent.wheelDelta;
					// Firefox
					var detal = event.originalEvent.detail;
					// 判断浏览器IE,谷歌滚轮事件
					if(event.originalEvent.wheelDelta) {
						// 当滑轮向上滚动时
						if(wheel > 0) {
							console.log("up");
							up()
						}
						// 当滑轮向下滚动时
						if(wheel < 0) {
							console.log("down");
							down()
						}
						
						setTimeout(function(){
							run();
						},1000)
					}
					// Firefox滚轮事件  
					else if(event.originalEvent.detail) {
						// 当滑轮向下滚动时
						if(detal > 0) {
							console.log("down");
							down()
						}
						// 当滑轮向上滚动时
						if(detal < 0) {
							console.log("up");
							up()
						}
						setTimeout(function(){
							run();
						},1000)
					}
				});
			/*响应键盘上下键*/
			$(document).one('keydown',k);
			function k(event){
				var e=event||window.event;
				var key=e.keyCode||e.which||e.charCode;
				switch(key)	{
					case 38: down();run();	
					break;
					case 40: up();run();	
					break;
				};
				setTimeout(function(){$(document).one('keydown',k)},1000);
			}
			// 监听触摸屏
		let box = document.querySelector('body') // 监听对象
			let startTime = '' // 触摸开始时间
			let startDistanceX = '' // 触摸开始X轴位置
			let startDistanceY = '' // 触摸开始Y轴位置
			let endTime = '' // 触摸结束时间
			let endDistanceX = '' // 触摸结束X轴位置
			let endDistanceY = '' // 触摸结束Y轴位置
			let moveTime = '' // 触摸时间
			let moveDistanceX = '' // 触摸移动X轴距离
			let moveDistanceY = '' // 触摸移动Y轴距离
			box.addEventListener("touchstart", (e) => {
				startTime = new Date().getTime()
				startDistanceX = e.touches[0].screenX
				startDistanceY = e.touches[0].screenY
				console.log("开始")
			})
			box.addEventListener("touchend", (e) => {
				endTime = new Date().getTime()
				endDistanceX = e.changedTouches[0].screenX
				endDistanceY = e.changedTouches[0].screenY
				moveTime = endTime - startTime
				moveDistanceX = startDistanceX - endDistanceX
				moveDistanceY = startDistanceY - endDistanceY
				console.log(moveDistanceX, moveDistanceY)
				// target = e.target || e.srcElement;
				// if(target.getAttribute('class') === "arrow"){
				// if(Math.abs(moveDistanceX) < 2 && Math.abs(moveDistanceY) < 2){
				// 	up()
				// 	run()
				// }
			// }
				// 判断滑动距离超过40 且 时间小于500毫秒
				if ((Math.abs(moveDistanceX) > 40 || Math.abs(moveDistanceY) > 40) && moveTime < 500) {
					// 判断X轴移动的距离是否大于Y轴移动的距离
					if (Math.abs(moveDistanceX) > Math.abs(moveDistanceY)) {
					// 左右
					console.log(moveDistanceX > 0 ? '左' : '右')
					} else {
					// 上下
					console.log(moveDistanceY > 0 ? '上' : '下')
						if(moveDistanceY>0){
							up();
						}else{
							down();
						}
						run();
					}
				}
				console.log("结束")
			})
		});
	</script>
</body>
</html>